// File: 关注动画组件
import 'dart:math';

import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_svg/svg.dart';
import 'package:xvideos/tools_base/debug_log.dart';
import 'package:xvideos/hj_utils/global.dart';

import '../../../../tools_base/global_store/store.dart';

/// 关注动画组件
class FollowItem extends StatefulWidget {
  final bool isFollow;
  final int? userID;
  final Function(bool isFollow)? updateFollow;

  const FollowItem({Key? key, this.isFollow = false, this.userID, this.updateFollow}) : super(key: key);

  @override
  State<StatefulWidget> createState() {
    return _FollowItemState();
  }
}

class _FollowItemState extends State<FollowItem> with TickerProviderStateMixin {
  late AnimationController _controller;

//  -----0.0 ～ 0.5------
  /// 新图 旋转
  Animation<double>? spin;

  /// 旧图 透明度 消失
  Animation<double>? transparency1;

  /// 新图 透明度 出现
  Animation<double>? transparency2;

  /// 新图 缩放 变大
  Animation<double>? zoom;

//  -----0.7 ～ 1.0------
  /// 新图 缩小
  Animation<double>? zoom2;

  //================
  /// 是否关注
  bool? isFollow;

  /// 最近一次请求是否成功
  bool? repStatus;

  @override
  void initState() {
    super.initState();
    isFollow = widget.isFollow;
    initAnim();
  }

  /// 初始化动画
  void initAnim() {
    // 前置图渐淡。新图渐显。变大1.3。 新图旋转
    // 缩小至无

    _controller = AnimationController(
      vsync: this,
      duration: const Duration(milliseconds: 800),
    )..addStatusListener(
        (AnimationStatus status) {
          if (status == AnimationStatus.completed) {
            if (repStatus == false) {
              _controller.reset();
              setState(() {});
            } else if (repStatus == true) {
              /// 请求成功
              isFollow = !(isFollow ?? false);
              setState(() {});
            }
          }
        },
      );
    _controller.addListener(() {
      setState(() {});
    });

    spin = Tween<double>(begin: -1.0 * pi, end: 0.0).animate(
      CurvedAnimation(
        parent: _controller,
        curve: const Interval(
          0.0,
          0.5,
          curve: Curves.linear,
        ),
      ),
    );
    // 前置图渐淡
    transparency1 = Tween<double>(begin: 1.0, end: 0.0).animate(
      CurvedAnimation(
        parent: _controller,
        curve: const Interval(
          0.0,
          0.2,
          curve: Curves.linear,
        ),
      ),
    );
    // 新图渐显
    transparency2 = Tween<double>(begin: 0.0, end: 1.0).animate(
      CurvedAnimation(
        parent: _controller,
        curve: const Interval(
          0.0,
          0.5,
          curve: Curves.linear,
        ),
      ),
    );
    // 新图变大1.3
    zoom = Tween<double>(begin: 1.0, end: 1.3).animate(
      CurvedAnimation(
        parent: _controller,
        curve: const Interval(
          0.0,
          0.5,
          curve: Curves.linear,
        ),
      ),
    );
    // 新图缩小至无
    zoom2 = Tween<double>(begin: 1.0, end: 0.0).animate(
      CurvedAnimation(
        parent: _controller,
        curve: const Interval(
          0.7,
          1.0,
          curve: Curves.linear,
        ),
      ),
    );
  }

  /// 点击关注
  void onTap() async {
    // 自己不能关注自己
    if (globalStore.isMe(widget.userID ?? 0)) {
      showToast("自己不能关注自己");
      return;
    }
    if (isFollow == true || _controller.status == AnimationStatus.forward) {
      return;
    }

    bool widgetIsFollow = !widget.isFollow;
    try {
      //TODO FIXME FOLLOW
      // await netManager.client.getFollow(followUID, widgetIsFollow);
      if (widgetIsFollow && widget.updateFollow != null) {
        widget.updateFollow!(widgetIsFollow);
      }
      repStatus = !widget.isFollow;
      if (_controller.status != AnimationStatus.forward) {
        isFollow = !widget.isFollow;
        setState(() {});
      }
    } catch (e) {
      debugLog('getFollow', e.toString());
      showToast(e.toString());
    }

    /// 动画
    playAnim();
  }

  /// 播放关注动画
  void playAnim() {
    _controller.reset();
    _controller.forward();
  }

  @override
  Widget build(BuildContext context) {
    return Opacity(
      opacity: (widget.isFollow == true) ? 0 : 1,
      child: Stack(
        children: <Widget>[
          SizedBox(
            width: 20,
            height: 20,
            child: Transform(
              alignment: Alignment.center, //相对于坐标系原点的对齐方式
              transform: Matrix4.rotationZ(spin?.value ?? 0)
                ..scale(zoom?.value, zoom?.value)
                ..scale(zoom2?.value, zoom2?.value),
              child: Opacity(
                opacity: (isFollow == true) ? 1 : (transparency2?.value ?? 0),
                child: SizedBox(
                  width: 20,
                  height: 20,
                  child: SvgPicture.asset(
                    "assets/svg/recd_follow_one.svg",
                    fit: BoxFit.cover,
                  ),
                ),
              ),
            ),
          ),
          if (widget.isFollow != true)
            SizedBox(
              width: 20,
              height: 20,
              child: Opacity(
                opacity: transparency1?.value ?? 0,
                child: GestureDetector(
                  onTap: onTap,
                  child: SizedBox(
                    width: 20,
                    height: 20,
                    child: SvgPicture.asset(
                      'assets/svg/recd_follow_one.svg',
                      fit: BoxFit.cover,
                    ),
                  ),
                ),
              ),
            ),
        ],
      ),
    );
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }
}
